<template>
    <div>
       <!-- 按钮 -->
       <div class="btns"> 
            <el-button type="primary" size="small" @click="toFormHandler">新增</el-button>
       </div>

       <!-- 表格 -->
       <div class="tab_content">
        <el-table :data="baseconfigs" style="width: 100%">
          <!-- 操作列 -->
            <el-table-column width="150" align="center" label="操作">
                <template slot-scope="scope">
                   <el-button type="primary" icon="el-icon-edit" size="small" @click="editHandler(scope.row)"></el-button>
                    <el-button type="primary" icon="el-icon-delete" size="small" @click="deleteHandler(scope.row)"></el-button>
                </template>
            </el-table-column>
            <el-table-column type="index" label="ID" align="center"> </el-table-column>
            <el-table-column prop="name" label="名称" align="center"> </el-table-column>
            <el-table-column prop="val" label="价值" align="center"></el-table-column>
            <el-table-column prop="introduce" label="介绍" align="center"></el-table-column>

        </el-table>
       </div>
    </div>
</template>




<script>
import { get, del } from '@/utils/request'
export default {
    // 定义变量
    data(){
        return{
            baseconfigs:[],
            visible:false,


        }
    },
    // 定义事件处理函数，方法
    methods:{
        // 删除数据
        deleteHandler(row){
            this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let url = "http://localhost:8888/baseConfig"
        del(url,{id:row.id}).then(resp =>{
          // 1. 提示
          this.$message({type:"success",message:resp.message});
          // 2. 刷新
          this.loadBseConfigs();
        })
      })
        },
        // 修改数据
        editHandler(row){
      this.$router.push({ 
        path:"/bjyx/baseconfig_form" ,
        query:row
      })
    },
        // 查询所有数据
        loadBseConfigs(){
            let url ="http://localhost:8888/baseConfig"
            get(url).then(resp=>{
                // 获取数据后做的事情
                this.baseconfigs = resp.data;
            })
        },
       // 跳转
        toFormHandler(){
      this.$router.push({ path:"/bjyx/baseconfig_form" })
    }

    },
    // 生命周期
    created(){
        this.loadBseConfigs()
    }

    
}
</script>




<style lang="sass" scoped>

</style>